<template>
  <div class="occupancy-main">
    <div ref="box" style="height:200px;width:100%;">

    </div>
  </div>
</template>

<script>
import echarts from "echarts"
export default {
  data() {
    return {

    }
  },
  methods: {
    print() {
      let print = echarts.init(this.$refs.box)
      let option = {
        title: [
          {
            text: "近六月入住情况",
            textStyle: {
              color: "yellow"
            }
          }
        ],
        textStyle: {
          color: "yellow"
        },
        label: {
          show: true,
          position: "left"
        },
        color: ["blue","red"],
        legend: {
          data: [{name: "搬入",icon: "circle"}, {name: "迁出",icon: "circle"}],
          textStyle: {
            color: "yellow"
          }
        },
        emphasis: {
          label: {
            show: true,
            fontSize: "20",
            fontWeight: "bold"
          }
        },
        tooltip: {
          trigger: "item"
        },
        xAxis: {
          type: "category",
          data: ["1", "2", "3", "4", "5", "6"]
        },
        yAxis: {
          type: "value"
        },
        series: [
          {
            data: [820, 932, 901, 934, 1290, 1330],
            type: "line",
            smooth: true,
            lineStyle: {
              color: "blue"
            },
            name: "搬入"
          },
          {
            data: [620, 832, 501, 334, 790, 630],
            type: "line",
            smooth: true,
            lineStyle: {
              color: "red"
            },
            name: "迁出"
          }
        ]
      }
      print.setOption(option)
    }
  },
  mounted() {
    this.print()
  }
}
</script>

<style>

</style>